<!doctype html>
<html>

	<head>

		<meta charset="utf-8">
		<title>我的</title>
		<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">

		<!--标准mui.css-->
		<link rel="stylesheet" href="css/mui.min.css">
		<!--引入的外部的icon图标-->
		<link rel="stylesheet" type="text/css" href="css/icons-extra.css" />
		<!--App自定义的css-->
		<link rel="stylesheet" type="text/css" href="css/app.css" />
		

		<style>
			body {
				background: #efefef;
			}
			
			.mui-icon-extra {
				font-size: 20px;
			}
			/*头部样式*/
			
			.us_hear {
				width: 100%;
				height: auto;
				background: #efefef;
				position: relative;
				overflow: hidden;
			}
			
			.us_hear_grade {
				position: absolute;
				right: 1rem;
				top: 1.8rem;
				width: 100px;
				height: 30px;
				line-height: 30px;
				text-align: center;
				background: white;
				border-radius: 15px;
			}
			
			.us_hear_grade img {
				width: 20px;
				height: 20px;
				margin: 5px 0 0 20px;
				float: left;
			}
			
			.us_hear_grade h4 {
				float: left;
				line-height: 30px;
			}
			
			.us_hear_img {
				margin-top: -30px;
				width: 100%;
				height: auto;
			}
			
			.us_hear_img .us_hear_touxiang {
				display: block;
				width: 60px;
				height: 60px;
				margin: 0 auto;
				margin-bottom: 10px;
				background: white;
				border-radius: 50%;
				border: 2px solid white;
			}
			
			.us_hear_img p {
				width: 100%;
				height: 20px;
				line-height: 20px;
				text-align: center;
				font-size: 14px;
			}
			
			.us_hear_cash {
				width: 100%;
				height: auto;
				margin-top: 20px;
				margin-bottom: 15px;
			}
			
			.us_hear_cash .us_hear_cent {
				width: 130px;
				height: 30px;
				line-height: 30px;
				margin: 0 auto;
				text-align: center;
				background: white;
				border-radius: 15px;
			}
			/*充值会员*/
			
			.recharge {}
			
			.recharge .recharge_title {
				display: inline-block;
				position: absolute;
				top: 16px;
				left: 52px;
				font-size: 18px;
			}
			/*提现记录、任务详情、收支明细*/
			
			.task {}
			
			.task img {
				width: 27px;
				float: left;
				margin-right: 10px;
			}
			
			.task .mui-table-view-cell:after {
				left: 0;
			}
			
			.task .task_title {
				line-height: 30px;
			}
			/*团队、海报、发圈、客服*/
			
			.us_xinxi {
				margin-top: 15px;
			}
			
			.us_xinxi img {
				width: 27px;
				margin-top: 7px;
			}
			
			.us_xinxi .mui-table-view-cell:after {
				left: 0;
			}
			/*合作招商*/
			
			.hezuo {
				margin-top: 15px;
			}
			
			.hezuo img {
				width: 27px;
				margin-top: 7px;
			}
			/*按钮*/
			
			.btn {
				width: 100%;
				height: 45px;
				line-height: 45px;
				text-align: center;
				color: red;
				background: white;
				margin-top: 25px;
				margin-bottom: 80px;
			}
		</style>
	</head>

	<body>

		<!--头部-->

		<div class="mui-content">
			<div class="us_hear">
				<div class="" style="height: 100px;background: url(img/user-by.jpg) no-repeat;">
					<div class="us_hear_grade">
						<img src="img/us_dengji.png" class="dengji_img" />
						<h4 style="margin-top: 0px;font-weight: 100;font-size: 16px;">登录</h4>
					</div>
				</div>
				

				<div class="us_hear_img">
					<img src="img/wdl_touxiang.png" class="us_hear_touxiang" />
					<p style="margin: 0;height: 15px;">登录</p>
					<p onclick="wanshan_xinxi()">个人资料<span class="mui-icon mui-icon-compose"></span></p>
				</div>

				<div class="us_hear_cash">
					<div class="mui-row">
						<div class="mui-col-sm-6 mui-col-xs-6">
							<div class="us_hear_cent">
								<span class="mui-icon-extra mui-icon-extra-gold"></span>暂无登录
							</div>
						</div>
						<div class="mui-col-sm-6 mui-col-xs-6">
							<div class="us_hear_cent">
								<a href="cash_money.html" style="color: black;">
									<span class="mui-icon-extra mui-icon-extra-prech"></span>提现
								</a>
							</div>
						</div>
					</div>
				</div>

			</div>
		</div>

		<!--充值会员-->

		<div class="mui-content">
			<div class="recharge">
				<div class="mui-card" style="margin: 0;border-top: 1px solid #c8c7cc;border-bottom:1px solid #C8C7CC;box-shadow: none;">
					<ul class="mui-table-view">
						<li class="mui-table-view-cell">
							<a class="mui-navigate-right" style="margin: -15px -19px -20px;" href="user_chongzhi.html">
								<img class="" src="img/user/member.png" style="height: 27px;"><span class="recharge_title">会员</span>
								<span class="mui-badge" style="background: none;">
									<img src="img/user/vip.png" alt="" class="" style="height: 21px;" />
								</span>
							</a>
						</li>
					</ul>
				</div>
			</div>

		</div>

		<!--提现记录、任务详情、收支明细-->

		<div class="task">
			<div class="mui-content">
				<ul class="mui-table-view">
					<li class="mui-table-view-cell">
						<a href="money_record.html" class="mui-navigate-right">
							<img src="img/user/cash.png" alt="" /><span class="task_title">提现记录</span>
						</a>
					</li>
					<li class="mui-table-view-cell">
						<a href="user_tasks_info.html" class="mui-navigate-right">
							<img src="img/user/renwu.png" alt="" /><span class="task_title">任务详细</span>
						</a>
					</li>
					<li class="mui-table-view-cell">
						<a href="income_list.html" class="mui-navigate-right">
							<img src="img/user/budget.png" alt="" /><span class="task_title">收支明细</span>
						</a>
					</li>
				</ul>
			</div>
		</div>

		<!--团队、海报、发圈、客服-->

		<div class="us_xinxi">
			<ul class="mui-table-view mui-table-view-chevron">
				<li class="mui-table-view-cell mui-media">
					<a href="team.html" class="mui-navigate-right">
						<img class="mui-media-object mui-pull-left" src="img/user/team.png" style="height: 27px;">
						<div class="mui-media-body">
							我的团队
							<p class='mui-ellipsis'>查看我的团队</p>
						</div>
					</a>
				</li>
				<li class="mui-table-view-cell mui-media">
					<a href="fenxiang.html" class="mui-navigate-right">
						<img class="mui-media-object mui-pull-left" src="img/user/poster.png" style="height: 27px;">
						<div class="mui-media-body">
							推广海报
							<p class='mui-ellipsis'>邀请我的好友</p>
						</div>
					</a>
				</li>
				<li class="mui-table-view-cell mui-media">
					<a href="uploader.html" class='mui-navigate-right' href="javascript:;">
						<img class="mui-media-object mui-pull-left" src="img/user/shangchuan.png" style="height: 27px;">
						<div class="mui-media-body">
							发圈上传
							<p class='mui-ellipsis'>截图朋友圈图片上传</p>
						</div>
					</a>
				</li>
				<li class="mui-table-view-cell mui-media">
					<a href="kefu.html" class="mui-navigate-right">
						<img class="mui-media-object mui-pull-left" src="img/user/kefu.png" style="height: 27px;">
						<div class="mui-media-body">
							客服中心
							<p class='mui-ellipsis'>使用QQ联系客服</p>
						</div>
					</a>
				</li>
			</ul>
		</div>

		<!--合作招商-->

		<div class="hezuo">
			<ul class="mui-table-view mui-table-view-chevron">
				<li class="mui-table-view-cell mui-media">
					<a href="zhaoshang.html" class="mui-navigate-right">
						<img class="mui-media-object mui-pull-left" src="img/user/coop.png" style="height: 27px;">
						<div class="mui-media-body">
							合作招商
							<p class='mui-ellipsis'>编辑合作内容，发送至邮箱。</p>
						</div>
					</a>
				</li>
			</ul>
		</div>

		<!--按钮-->

		<div class="btn"><a href="login.html">登录账号</a></div>

		<!-- 底部Tab 开始 -->
		<nav class="mui-bar mui-bar-tab super_link">
			<a class="mui-tab-item" href="index.html">
				<span class="mui-icon mui-icon-home"></span>
				<span class="mui-tab-label">首页</span>
			</a>
			<a class="mui-tab-item" href="my_tasks.html" >
				<span class="mui-icon mui-icon-email"></span>
				<span class="mui-tab-label">我的任务</span>
			</a>
			<a class="mui-tab-item" href="issue.html">
				<span class="mui-icon mui-icon-paperplane"></span>
				<span class="mui-tab-label">发圈</span>
			</a>
			<a class="mui-tab-item" href="shop.html">
				<span class="mui-icon mui-icon-chatbubble"></span>
				<span class="mui-tab-label">招商</span>
			</a>
			<a class="mui-tab-item mui-active" href="user.html">
				<span class="mui-icon mui-icon-contact"></span>
				<span class="mui-tab-label">我的</span>
			</a>
		</nav>
		<!-- 底部Tab 结束 -->

		<script src="js/mui.min.js"></script>
		<script src="js/jquery.min.js"></script>
		<!--公共类的js-->
		<script src="js/public.js"></script>
		<script type="text/javascript">
			mui.init({
				swipeBack: true //启用右滑关闭功能
			})

			function wanshan_xinxi() {
				if(0) {
					mui.alert(111)
				} else {
					mui.openWindow({
						url: 'register.html', //需要打开页面的url地址 
						id: 'register', //需要打开页面的url页面id
						styles: {
							top: '0px', //新页面顶部位置 
							bottom: '0px', //新页面底部位置 
						},
						extras: {
							name:'aries',
							age:'18',
						},
					});
				}
			}
			
			
		</script>
	</body>

</html>